<template>
	<view class="box">
		<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
		<u--form labelWidth="150" labelPosition="left" :model="model1" :rules="rules" ref="uForm">
			<u-form-item label="请选择组别" prop="groupId" :borderBottom="true" ref="item1">
				<uni-data-select v-model="model1.groupId" :localdata="groups"></uni-data-select>
			</u-form-item>
			<u-form-item label="" prop="name" ref="item1">
				<u-button text="查询" type="primary" shape="circle" @click="getlist"></u-button>
			</u-form-item>

		</u--form>

	</view>
	<div class="box">
		<div class="table" v-if="dataList.length>0">
			<zy-table :headList="headList" :dataList="dataList" :loading="loading"></zy-table>
		</div>
		<div class="mb30" v-else>
			<u-empty mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png">
			</u-empty>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {

				//表头数据
				headList: [{
					name: '车名',
					width: '150',
					key: 'carName'
				}, {
					name: 'ECU0/%',
					width: '120',
					key: 'ecu0',
					sort: true
				}, {
					name: 'ECU1/%',
					width: '120',
					key: 'ecu1',
					sort: true
				}, {
					name: 'ECU2/%',
					width: '120',
					key: 'ecu2',
					sort: true
				}, {
					name: 'ECU3/%',
					width: '120',
					key: 'ecu3',
					sort: true
				}, {
					name: 'ECU4/%',
					width: '120',
					key: 'ecu4',
					sort: true
				}, {
					name: 'ECU5/%',
					width: '120',
					key: 'ecu5',
					sort: true
				}],
				//默认表格数据
				dataList: [],
				index: '',
				loading: false,
				model1: {

				},
				groups: getApp().globalData.groups,
			};
		},
		onLoad() {
			// this.getlist()
		},
		methods: {
			getlist() {
				this.$http('/api/upload/differentialRatio', this.model1).then(r => {
					console.log(r)
					this.dataList = r.data
				})
			},

			submit() {
				this.$refs.uForm.validate().then(res => {
					uni.$u.toast('校验通过')
				}).catch(errors => {
					uni.$u.toast('校验失败')
				})
			}
		},
	};
</script>
<style lang="scss">
	:deep(.u-upload__wrap) {
		justify-content: flex-end !important;
	}
</style>